<div class="row">
    <div class="col-xs-12">
        <div class="box">
            <div class="box-header">
                <h2 class="box-title">查看您的个人信息</h2>

                <div class="box-tools">
                    <div class="input-group input-group-sm" style="width: 350px;">
                        <div class="input-group-btn">
                            <button type="button" class="btn btn-default do-update" onclick="doLoadEditUI()">修改信息
                            </button>
                        </div>
                    </div>
                </div>
            </div>
            <!-- /.box-header -->
            <div class="box-body table-responsive no-padding">
                <table class="table table-hover">
                    <thead>
                    <tr>
                        <th>ID</th>
                        <th>用户名</th>
                        <th>性别</th>
                        <th>生日</th>
                        <th>部门</th>
                        <th>邮箱</th>
                        <th>手机号</th>
                        <th>创建时间</th>
                    </tr>
                    </thead>
                    <tbody id="tbodyId"></tbody>
                </table>
            </div>
            <!-- /.box-body -->
        </div>
        <!-- /.box -->
    </div>
</div>
<script type="text/javascript">
    $(document).ready(function () {
        $("#tbodyId").load(doGetUserInfoObjects());
    });

    function doLoadEditUI() {
        console.log("doLoadEditUI()")
        let title = "修改个人信息";
        let id = getCurrentUserData();
        //基于id进行查询并加载编辑页面
        doFindObjectById(id, title);
    }

    function doFindObjectById(id, title) {
        let url = `user/doFindUserInfo/${id}`;
        $.getJSON(url, function (result) {//JsonResult
            if (result.state == 1) {
                doLoadPage(title);
            } else {
                alert(result.message);
            }
        });
    }


    function doLoadPage() {
        let title = "意见箱";
        let url = "user/info_edit"
        $("#mainContentId").load(url, function () {
            $(".box-title").html(title);
        })
    }

    //页面加载完成异步加载当前页数据
    function doGetUserInfoObjects() {
        var id = getCurrentUserData();
        console.log("当前用户id=" + id);
        let url = `user/doFindUserInfo/${id}`;
        $.ajax({
            url,
            success(result) {
                doHandleResponseResult(result);
            }
        });
    }

    function getCurrentUserData() {
        var id;
        $.ajax({
            url: "user/doFindCurrentUserId",
            async: false,
            success: function (result) {
                id = result;
            }
        })
        return id;
    }

    function doHandleResponseResult(result) {
        if (result.state == 1) {
            doSetTableBodyRows(result.data);
        } else {
            alert(result.message);
        }
    }

    //通过服务端返回的数据初始化页面
    function doSetTableBodyRows(data) {
        //1.获取tbody对象，并清空内容
        var tBody = $("#tbodyId");
        tBody.empty();
        //2.迭代data内容将数据追加到tbody中
        var tr = $("<tr></tr>");
        var tds = doCreateTds(data);
        tr.append(tds);
        tBody.append(tr);
    }

    function doCreateTds(row) {
        var tds = "<td>" + row.id + "</td>" +
            "<td>" + row.username + "</td>" +
            "<td>" + (row.sex ? row.sex : '未设置') + "</td>" +
            "<td>" + (row.birthday ? row.birthday.substr(0, 10) : '未设置') + "</td>" +
            "<td>" + (row.deptName ? row.deptName : '未分配') + "</td>" +
            "<td>" + row.email + "</td>" +
            "<td>" + row.mobile + "</td>" +
            "<td>" + new Date(row.createdTime).toLocaleString() + "</td>";
        return tds;
    }
</script>




